<template>
	<view class="wrap" style="padding-top:50rpx;">
		<view class="reg-text">欢 迎 注 册</view>
		<!-- 用户名注册 -->
		<view>
			<!-- 输入框 -->
			<view class="list">
				<!-- 用户名 -->
				<view class="list-call">
					<view class="iconfont icon-avatar" style="font-size: 22px;color:#5473e8;"></view>
					<input class="u-input" type="text" v-model="username" maxlength="16" placeholder="请输入用户名" />
				</view>
				<!-- 密码 -->
				<view class="list-call">
					<view class="iconfont icon-key" style="font-size: 22px;color:#5473e8;"></view>
					<input class="u-input" type="text" v-model="password1" maxlength="32" placeholder="请输入密码"
						:password="true" />
				</view>
				<!-- 确认密码 -->
				<view class="list-call">
					<view class="iconfont icon-key" style="font-size: 22px;color:#5473e8;"></view>
					<input class="u-input" type="text" v-model="password2" maxlength="32" placeholder="请确认密码"
						:password="true" />
				</view>

			</view>

			<view class="button" @click="regNext"><text>下一步</text></view>

			<view class="bottom-box">
				<view class="copyright">
					注册即代表您已阅读并同意<u-link href="#">用户协议</u-link> 与 <u-link href="#">隐私政策</u-link>
				</view>
			</view>
		</view>
		<!-- 提示框 -->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username: '',
				password1: '',
				password2: ''
			};
		},
		onLoad() {},
		methods: {
			regNext() {
				if (this.password1 === this.password2) {
					this.$u.vuex('userRegInfo', {
						'username': this.username,
						'password': this.password1
					})
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/sys/login/reg-info'
						});
					}, 500);
				} else {
					this.$refs.uToast.show({
						title: '两次密码不一致',
						type: 'error',
					})
				}

			},
		}
	};
</script>

<style lang="scss">
	@import 'index.scss';

	.uni-input-placeholder {
		font-size: 32rpx;
	}

	.uni-input-input {
		font-size: 32rpx;
	}

	.u-border-bottom:after {
		border-bottom-width: 0px !important;
	}

	.bottom-box {
		border-top: 0px !important;
	}
</style>
